.selectedMain {

  .selectButton {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 32px;
    line-height: 32px;
    background-color: #fff;
    border: dashed 1px #ddd;
    border-radius: var(--inbiz-border-radius-base);
    cursor: pointer;

    .selectText {
      span {
        color: var(--inbiz-color-primary);
        font-size: 14px;
        font-size: var(--inbiz-font-size-base);
      }
    }
  }

  .selectButtonForbid {
    background-color: #f5f5f5;
    cursor: no-drop;

    .selectText {
      span {
        color: #b7b7b7;
      }
    }
  }

  .selectButtonHover:hover {
    border: dashed 1px var(--inbiz-color-primary);
  }

  .designList {
    box-sizing: border-box;
    width: 100%;
    min-width: 310px;
    // min-width: 310px;
    max-height: 340px;
    margin-top: 10px;
    overflow: hidden;
    border: 1px solid #ddd;
    border-radius: var(--inbiz-border-radius-base);

    .designListUp {
      display: flex;
      justify-content: space-between;
      padding: 0 8px;
      line-height: 40px;

      .designSelectNum {
        color: #999;
      }

      .designDel {
        color: var(--inbiz-color-primary);
        cursor: pointer;
      }
    }
  }

  .selectList {
    box-sizing: border-box;
    width: 100%;
    max-height: 240px;
    overflow: auto;

    .selectListBox {
      display: flex;
      box-sizing: border-box;
      height: 40px;

      .selectListName {
        display: flex;
        width: 90%;
        padding-left: 8px;
        line-height: 40px;
        cursor: pointer;

        img {
          height: 16px;
          margin: -3px 5px 0 0;
        }

        .listName {
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          cursor: pointer;
        }
      }

      .delList {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: 10%;
        height: 100%;
        padding-right: 16px;
        overflow: hidden;
        cursor: pointer;
        opacity: 0;

        .delIcons {
          width: 14px;
          height: 14px;
          color: #fff;
          font-size: 14px;
          line-height: 16px;
          background-color: #f25b43;
          border-radius: 50%;

          svg {
            width: 8px;
          }
        }
      }
    }

    .selectListBoxhover:hover {
      background: #f5f5f5;
    }

    .selectListBoxhover:hover .delList {
      opacity: 1;
    }
  }

  .selectImgList {
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
    max-height: 280px;
    overflow: auto;

    .selectListBox {
      position: relative;
      width: 88px;
      height: 125px;
      margin-bottom: 15px;
      margin-left: 15px;
      border-radius: 2px;

      .selectListName {
        position: relative;
        box-sizing: border-box;
        &:hover {
          color: var(--inbiz-color-primary);
        }

        .fileIcons {
          width: 88px;
          height: 88px;
          padding: 26px 0 0 28px;
          border-radius: 4px;
          cursor: pointer;

          img {
            height: 32px;
          }
        }

        .mock {
          position: absolute;
          top: 0;
          left: 0;
          display: none;
          width: 88px;
          height: 88px;
          padding: 28px 0 0 28px;
          border-radius: 4px;
          cursor: pointer;
        }

        .listName {
          display: -webkit-box;
          width: 100%;
          height: 36px;
          margin-top: 5px;
          overflow: hidden;
          font-size: 14px;
          line-height: 18px;
          text-align: center;
          word-break: break-all;
          cursor: pointer;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 2;
        }
      }

      .delList {
        display: block;
        cursor: pointer;
        opacity: 0;

        .delIcons {
          position: absolute;
          top: 5px;
          right: 5px;
          width: 14px;
          height: 14px;
          color: #fff;
          font-size: 14px;
          line-height: 16px;
          background-color: #f25b43;
          border-radius: 50%;

          svg {
            width: 8px;
          }
        }
      }
    }

    .selectListBoxhover:hover .selectListName .mock {
      display: block;
      background: #000;
      opacity: 0.5;
    }

    .selectListBoxhover:hover .delList {
      opacity: 1;
    }
  }

  .radioSelectList {
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    min-width: 310px;
    height: 32px;
    padding: 0 12px;
    line-height: 32px;
    background-color: #fff;
    border: solid 1px #ddd;
    border-radius: 2px;

    .radioNameBox {
      display: flex;
      align-items: center;
      width: 90%;
      min-width: 240px;
      cursor: pointer;

      img {
        width: 16px;
        height: 16px;
        margin-right: 5px;
      }

      .radioName {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
    }

    .radioDelBox {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      width: 10%;
      min-width: 50px;
      color: var(--inbiz-color-primary);
      cursor: pointer;

      span {
        width: 14px;
        height: 14px;
        color: #fff;
        font-size: 14px;
        background-color: #f25b43;
        border-radius: 50%;
        opacity: 0;

        svg {
          width: 8px;
        }
      }
    }
  }

  .radioSelectListHover:hover .radioDelBox span {
    opacity: 1;
  }

  .radioSelectImg {
    position: relative;
    width: 88px;
    height: 125px;

    .radioImgBox {
      box-sizing: border-box;
      width: 88px;
      height: 88px;
      padding: 25px 0 0 27px;
      border: 1px solid #ddd;
      border-radius: 4px;
      cursor: pointer;

      img {
        width: 32px;
      }
    }

    .mask {
      position: absolute;
      top: 0;
      left: 0;
      display: none;
      width: 88px;
      height: 88px;
      background: #000;
      border-radius: 4px;
      cursor: pointer;
      opacity: 0.5;
    }

    .radioName {
      display: -webkit-box;
      width: 100%;
      height: 36px;
      margin-top: 5px;
      overflow: hidden;
      font-size: 14px;
      line-height: 18px;
      text-align: center;
      word-break: break-all;
      cursor: pointer;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .radioDelBox {
      display: none;
      cursor: pointer;

      .radioDelIcons {
        position: absolute;
        top: 5px;
        right: 5px;
        width: 14px;
        height: 14px;
        color: #fff;
        font-size: 14px;
        line-height: 16px;
        background-color: #f25b43;
        border-radius: 50%;

        svg {
          width: 8px;
        }
      }
    }
  }

  .radioSelectImgHover:hover .mask,
  .radioSelectImgHover:hover .radioDelBox {
    display: block;
  }
}

.inbizSeletDocModel {
  .ant-btn{
    border-radius: var(--inbiz-border-radius-base);
  }
  .selectNum {
    float: left;
    margin-left: 6px;
    line-height: 32px;

    .upIcon {
      width: 9px;
      height: 5px;
      margin-left: 6px;
      color: var(--inbiz-color-heading);
      transform: rotate(360deg);
      transform-origin: 7px 7px;
      transition: all 0.2s;
      // &:hover{
      //   color: var(--inbiz-color-primary);
      // }
    }

    .downIcon {
      width: 9px;
      height: 5px;
      margin-left: 6px;
      color: var(--inbiz-color-primary);
      transform: rotate(180deg);
      transform-origin: 7px 7px;
      transition: all 0.2s;
      // &:hover{
      //   color: var(--inbiz-color-primary);
      // }
    }
  }
  .ant-btn-default:hover{
    color:var(--inbiz-color-primary) !important;
  }
  .inbizModalList {
    display: flex;
    width: 760px;
    height: 437px;
    border: 1px solid #ddd;
    .modelTable {
      width: 575px;

      .ant-input-affix-wrapper .ant-input {
        font-size: 14px;
      }

      .ant-input-affix-wrapper .ant-input::-webkit-input-placeholder {
        font-size: 14px;
      }

      .modelCheck {
        margin: 10px 0 0 20px;
        color: var(--inbiz-color-heading);
        font-weight: 500;
        line-height: 32px;

        .subfile {
          font-size: 14px;
          vertical-align: top;
        }
      }

      .modalSearch {
        width: 260px;
        height: 32px;
        margin: 10px 0 10px 10px;
      }
    }

    .modalTree {
      position: relative;
      width: 183px;
      height: 100%;
      overflow: auto;
      border-right: 1px solid #ddd;

      .spin {
        position: sticky;
        top: 0;
        z-index: 2;
        width: 100%;
        height: 100%;
        background: #0001;
      }

      .ant-tree-list {
        width: fit-content;
        min-width: 182px;
      }

      .ant-tree-title {
        font-size: 14px;
      }

      .ant-tree-treenode {
        height: 32px;
        padding-top: 4px;
        color: var(--inbiz-color-heading);
        white-space: nowrap;
        // &.ant-tree-treenode-leaf-last{
        //   color: #aaa;
        // }

        // .ant-tree-node-content-wrapper-normal {
        //   color: #aaa;
        // }
      }
      .ant-tree-treenode-switcher-open.ant-tree-treenode {
        // .ant-tree-node-content-wrapper-normal {
        //   color: #000000A6;
        // }

        .ant-tree-switcher-noop::before {
          display: block;
          width: 8px;
          height: 8px;
          margin: 7px 0 0 4px;
          border: 2px solid #aaa;
          border-radius: 50%;
          content: '';
        }

        .ant-tree-switcher .ant-tree-switcher-icon {
          margin-top: 3px;
        }
      }

      .ant-tree-treenode:hover {
        background: #f5f5f5;
      }

      .ant-tree-treenode.ant-tree-treenode-selected {
        background: rgba(var(--inbiz-color-primary-toRGB), 0.1);
      }

      .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
        background: transparent;
      }

      .ant-tree-switcher {
        width: 10px;
        margin: 0 8px 0 10px;
      }

      .ant-tree-node-content-wrapper {
        padding: 0;
        transition: all 0s, border 0s, line-height 0s, box-shadow 0s;

        .ant-tree-iconEle {
          width: 15px;
          height: 14px;
          margin-right: 6px;
        }
      }
    }
  }

  .modalListShow {
    height: 357px;
  }

  .ant-modal-footer {
    // padding: 10px 20px 20px !important;
    .footerBox {
      display: flex;
      flex-wrap: wrap;
      align-content: flex-start;
      width: 100%;
      overflow: auto;
      text-align: left;
      .tagClose {
        height: 24px;
        margin-bottom: 5px;
        border-radius: 2px;

        .ant-tag {
          height: 24px;
          line-height: 24px;
          white-space: nowrap;
          background: #f8f8f8;
          border: 0;

          .ant-tag-close-icon {
            width: 14px;
            margin-left: 9px;
            color: #fff;
            line-height: 14px;
            background-color: #ccc;
            border-radius: 50%;

            // svg {
            //   height: 8px;
            // }
          }
        }

        .ant-tag .ant-tag-close-icon:hover {
          background-color: red;
        }
      }
    }

    .ant-btn + .ant-btn:not(.ant-dropdown-trigger) {
      margin-left: 15px;
    }
  }

  .modalTableBox {
    height: 345px;
    margin-bottom: 4px;

    .noData {
      .ant-table-body {
        height: 340px;

        .ant-table-placeholder {
          height: 330px;
        }
      }
    }

    .ant-table-cell {
      padding: 8px 0 9px 10px;
      font-size: 14px;
    }

    .ant-table-placeholder {
      height: 290px;

      .ant-table-cell {
        border: 0;
      }
    }

    .ant-table-body {
      height: 308px;
      .ant-table-row {
        cursor: pointer;
      }

      .ant-table-tbody > tr.ant-table-row-selected > td {
        background: rgba(var(--inbiz-color-primary-toRGB), 0.1);
      }
    }

    .modalSearch {
      width: 260px;
      height: 32px;
      margin: 10px 0 10px 10px;
    }

    .modalPaginationBox {
      position: relative;
      display: flex;
      justify-content: right;
      height: 24px;
      margin-right: 10px;
      font-size: 15px;
      line-height: 24px ;

      .ant-pagination-item,
      .ant-pagination-jump-next,
      .ant-pagination-jump-prev {
        display: none;
      }

      .ant-select {
        position: absolute;
        top: 0;
        left: 10px;
      }
    }
  }

  .modalTableBox.modalTableBoxShow {
    height: 265px;

    .noData {
      .ant-table-placeholder {
        height: 250px;
      }
    }

    .ant-table-placeholder {
      height: 220px;
    }
  }
}

.modalTableBox.hideModal {
  height: 397px;

  .ant-table-body {
    height: 352px;
  }
}

.modalTableBox.modalTableBoxShow.hideModal {
  height: 317px;
}